/**
 * 客户列表
*/

var banner = new Object({
    table:null,
    init:function(){
        if(null != this.table)
            return;
        this.queryInfo();
        this.bindEvent();
    },
    queryInfo:function(){
        this.table = $('#tb_notice_banner').bootstrapTable({
            url: contextPath + '/notice/banner/listData.json',
            responseHandler: function (res) {
                return res.data;
            },
            queryParams: function (params) {
                return params;
            },
            pagination: true,
            pageList: '[10,20, 50, 100]',
            //showColumns: true,
            showRefresh: true,
            showToggle: true,
            //showPaginationSwitch:true,
            sidePagination: 'server',
            //striped:true,
            sortable: false,
            height: 700,
            search: true,
            searchAlign: 'left',
            toolbar: '<div style="float: left;margin-right:5px;">' +
            '    <button class="btn btn-default" type="button" onclick="banner.add()">' +
            '        <i style="margin-right:2px;" class="fa fa-search"></i>' +
            '        <span>新增</span>' +
            '    </button>' +
            '</div>',
            idField: 'id',
            uniqueId: 'id',
            //singleSelect: true,
            clickToSelect: true,
            columns: [{
                field: 'sortNum',
                title: '排序ID',
                width: 100
            }, {
                field: 'title',
                title: '标题',
                width: 100
            }, {
                field: 'picThumbnailUrl',
                title: '缩略图',
                width: 100,
                formatter:function(value,row,index){
                    return '<img src="' + value + '" height="30" width="30" />';
                }
            }, {
                field: 'status',
                title: '状态',
                width: 100,
                formatter:function(value,row,index){
                    if(value == 1){
                        return '启用'
                    }else{
                        return '未启用'
                    }
                }
            }, {
                field: 'targetUrl',
                title: '跳转地址',
                width: 60,
                formatter:function(value,row,index){
                    if(value == undefined){
                        return '无';
                    }else {
                        return '<a href=' + value + '>' + value + '</a>'
                    }
                }
            },{
                field: 'op',
                title: '操作',
                align: 'center',
                width: 100,
                formatter: function (value, row, index) {
                    var strHtml = '';
                        //strHtml += '<a href="javascript:void(0);" onclick="client_list.edit('+row.id+',\''+row.name+'\','+row.ratio+')">编辑</a>&nbsp;&nbsp;';
                    strHtml = '<div class="btn-group">' +
                    '<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">更多<i class="fa fa-caret-down"></i></button>' +
                    '   <ul class="dropdown-menu">'+
                    '       <li><a href="javascript:void(0);" onclick="banner.editDetails('+row.id+')">编辑</a></li>'+
                    '       <li><a href="javascript:void(0);" onclick="banner.deleteBanner('+row.id+')">删除</a></li>'+
                    '   </ul>'+
                    '</div>'
                    return strHtml;
                }
            }]
        });
        $('.search input').attr("placeholder", "名称");
    },
    bindEvent: function () {
        $('#upload_img_1').on('clearInput',function(e){
            $("#banner_img_1").attr("src",banner.kongbai_img)
        });

        $('#upload_img_1').die().live('change',function(){
            $.ajaxFileUpload({
                url:contextPath+'/file/upload',
                secureuri:false,
                fileElementId:'upload_img_1',//file标签的id
                dataType: 'json',//返回数据的类型
                //data:{name:'logan'},//一同上传的数据
                success: function (res, status) {
                    //把图片替换
                    $("#banner_img_1").attr("src",res.data.file_thumbnail_url)
                    $('#b_pic_url').attr('value',res.data.file_url);
                    $('#b_pic_thumbnail_url').attr('value',res.data.file_thumbnail_url);
                    if(typeof(res.error) != 'undefined') {
                        if(res.error != '') {
                            alert(res.error);
                        } else {
                            alert(res.msg);
                        }
                    }
                },
                error: function (data, status, e) {
                    alert(e);
                }
            });
        });

        $('#upload_img_2').on('clearInput',function(e){
            $("#banner_img_2").attr("src",banner.kongbai_img)
        });

        $('#upload_img_2').die().live('change',function(){
            $.ajaxFileUpload({
                url:contextPath+'/file/upload',
                secureuri:false,
                fileElementId:'upload_img_2',//file标签的id
                dataType: 'json',//返回数据的类型
                //data:{name:'logan'},//一同上传的数据
                success: function (res, status) {
                    //把图片替换
                    $("#banner_img_2").attr("src",res.data.file_thumbnail_url)
                    $('#b_pic_url_detail').attr('value',res.data.file_url);
                    $('#b_pic_thumbnail_url_detail').attr('value',res.data.file_thumbnail_url);
                    if(typeof(res.error) != 'undefined') {
                        if(res.error != '') {
                            alert(res.error);
                        } else {
                            alert(res.msg);
                        }
                    }
                },
                error: function (data, status, e) {
                    alert(e);
                }
            });
        });
    },
    kongbai_img:'http://static-wwj.ballq.cn/upload/images/kongbai.png',
    add:function(){
        var addBannerModal = '<div id="addBannerModal" class="modal fade" tabindex="-1" role="dialog" style="display: none;">'+
            '   <div class="modal-dialog">'+
            '       <div class="modal-content">'+
            '           <div class="modal-header">'+
            '<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>'+
            '               <h4 class="modal-title" id="setWxInfoModalLabel">创建Banner</h4>'+
            '           </div>'+
            '           <div class="modal-body">'+
            '               <form class="form-horizontal" id="addBannerForm">'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">标题：</label>'+
            '                       <div class="col-sm-9">'+
            '                           <input type="text" class="form-control" name="title" />'+
            '                       </div>'+
            '                   </div>'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">跳转链接：</label>'+
            '                       <div class="col-sm-9">'+
            '                           <input type="text" class="form-control" name="targetUrl" />'+
            '                       </div>'+
            '                   </div>'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">排序ID：</label>'+
            '                       <div class="col-sm-9">'+
            '                           <input type="text" class="form-control" name="sortNum" value="99" />'+
            '                       </div>'+
            '                   </div>'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">状态：</label>'+
            '                       <div class="col-sm-9" style="padding-top:3px;">'+
            '                           <div class="radio" style="margin-top: 0;float:left;margin-right:20px">'+
            '                               <label>'+
            '                                   <input type="radio" name="status" id="status1" value="0" checked="true"  class="px">'+
            '                                   <span class="lbl">未启用</span>'+
            '                               </label>'+
            '                           </div> <!-- / .radio -->'+
            '                           <div class="radio" style="margin-bottom: 0;float:left">'+
            '                               <label>'+
            '                                   <input type="radio" name="status" id="status2" value="1" class="px">'+
            '                                   <span class="lbl">启用</span>'+
            '                               </label>'+
            '                            </div>'+
            '                       </div>'+
            '                   </div>' +
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">轮播图：</label>'+
            '                       <div class="col-sm-9" style="padding-top:7px;">' +
            '                           <input type="file" id="upload_img_1" name="upload" class="file" multiple data-min-file-count="1"/>' +
            '                           <div class="dropzone-box" style="text-align:center">' +
            '                               <img src="'+banner.kongbai_img+'" id="banner_img_1" style="padding:20%;width:100%;height:100%"/>'+
            '                          </div>' +
            '                       </div>'+
            '                   </div>'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">详情图：</label>'+
            '                       <div class="col-sm-9" style="padding-top:7px;">' +
            '                           <input type="file" id="upload_img_2" name="upload" class="file" multiple data-min-file-count="1"/>' +
            '                           <div class="dropzone-box" style="text-align:center">' +
            '                               <img src="'+banner.kongbai_img+'" id="banner_img_2" style="padding:20%;width:100%;height:100%"/>'+
            '                          </div>' +
            '                       </div>'+
            '                   </div>'+
            '                   <input type="hidden" name="picUrl" id="b_pic_url"/>'+
            '                   <input type="hidden" name="picThumbnailUrl" id="b_pic_thumbnail_url"/>'+
            '                   <input type="hidden" name="detailPicUrl" id="b_pic_url_detail"/>'+
            '                   <input type="hidden" name="detailPicThumbnailUrl" id="b_pic_thumbnail_url_detail"/>'+
            '               </form>'+
            '           </div>' +
            '           <div class="modal-footer">' +
            '               <center>' +
            '                   <button class="btn btn-primary" onclick="banner.addSubmit()" >保存</button>' +
            '                   <button class="btn btn-primary" type="button" data-dismiss="modal" aria-hidden="true">关闭</button>' +
            '               </center>' +
            '           </div>'+
            '       </div>'+
            '   </div>'+
            '</div>';

        /**
         * 添加html中，隐藏
         */
        document.body.appendChild($(addBannerModal)[0]);
        $('#addBannerModal').on('hidden.bs.modal', function () {
            document.body.removeChild($('#addBannerModal')[0]);
        });

        //$('#upload_img').pixelFileInput({ placeholder: '没有选择文件...' });

        banner.bindEvent();

        //显示
        $("#addBannerModal").modal('show')
    },
    addSubmit:function(){
        $.ajax({
            url:contextPath+'/notice/banner/add',
            method:'post',
            data:$('#addBannerForm').serialize(),
            success:function(res){
                banner.table.bootstrapTable('refresh');
            },
            error: function () {
                alert_message("添加出错，请联系管理员")
            }
        });
        banner.closeAddModal();
    },
    closeAddModal:function(){
        $('#addBannerModal').modal('hide');
    },
    editDetails:function(id){
        var res = "";
        $.ajax({
            url:contextPath+'/notice/banner/findById/'+id,
            method:'get',
            async:false,
            success:function(data){
                //获取数据
                res = data;
            },
            error:function(){
                alert_message('请求错误，请联系管理员');
            }
        });
        var editBannerModal = '<div id="editBannerModal" class="modal fade" tabindex="-1" role="dialog" style="display: none;">'+
            '   <div class="modal-dialog">'+
            '       <div class="modal-content">'+
            '           <div class="modal-header">'+
            '<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>'+
            '               <h4 class="modal-title" id="setWxInfoModalLabel">编辑Banner</h4>'+
            '           </div>'+
            '           <div class="modal-body">'+
            '               <form class="form-horizontal" id="editBannerForm">'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">标题：</label>'+
            '                       <div class="col-sm-9">'+
            '                           <input type="text" class="form-control" name="title" value="'+res.data.title+'" />'+
            '                           <input type="hidden" class="form-control" name="id" value="'+res.data.id+'" />'+
            '                       </div>'+
            '                   </div>'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">跳转链接：</label>'+
            '                       <div class="col-sm-9">'+
            '                           <input type="text" class="form-control" name="targetUrl" value="'+res.data.targetUrl+'" />'+
            '                       </div>'+
            '                   </div>'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">排序ID：</label>'+
            '                       <div class="col-sm-9">'+
            '                           <input type="text" class="form-control" name="sortNum" value="'+res.data.sortNum+'" />'+
            '                       </div>'+
            '                   </div>'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">状态：</label>'+
            '                       <div class="col-sm-9" style="padding-top:3px;">'+
            '                           <div class="radio" style="margin-top: 0;float:left;margin-right:20px">'+
            '                               <label>';
        if(res.data.status == 0){
            editBannerModal += '<input type="radio" name="status" id="status1" value="0" checked="true"  class="px">';
        }else{
            editBannerModal += '<input type="radio" name="status" id="status1" value="0"  class="px">';
        }
        editBannerModal += '                     <span class="lbl">未启用</span>'+
            '                               </label>'+
            '                           </div> <!-- / .radio -->'+
            '                           <div class="radio" style="margin-bottom: 0;float:left">'+
            '                               <label>';
        if(res.data.status == 1){
            editBannerModal +=' <input type="radio" name="status" id="status2" checked="true" value="1" class="px">';
        }else{
            editBannerModal +=' <input type="radio" name="status" id="status2" value="1" class="px">';
        }
        editBannerModal +='                 <span class="lbl">启用</span>'+
            '                               </label>'+
            '                            </div>'+
            '                       </div>'+
            '                   </div>' +
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">轮播图：</label>'+
            '                       <div class="col-sm-9" style="padding-top:7px;">' +
            '                           <input type="file" accept="image/*" id="upload_img_1" name="upload" class="file" multiple data-min-file-count="1"/>' +
            '                           <div class="dropzone-box" style="text-align:center">' +
            '                               <img src="'+res.data.picUrl+'" id="banner_img_1" style="width:100%;height:100%"/>'+
            '                          </div>' +
            '                       </div>'+
            '                   </div>'+
            '                   <div class="form-group">'+
            '                       <label class="col-sm-3 control-label">详情图：</label>'+
            '                       <div class="col-sm-9" style="padding-top:7px;">' +
            '                           <input type="file" accept="image/*" id="upload_img_2" name="upload" class="file" multiple data-min-file-count="1"/>' +
            '                           <div class="dropzone-box" style="text-align:center">' +
            '                               <img src="'+(res.data.detailPicUrl==null?banner.kongbai_img:res.data.detailPicUrl)+'" id="banner_img_2" style="width:100%;height:100%"/>'+
            '                          </div>' +
            '                       </div>'+
            '                   </div>'+
            '                   <input type="hidden" name="picUrl" id="b_pic_url" value="'+res.data.picUrl+'"/>'+
            '                   <input type="hidden" name="picThumbnailUrl" id="b_pic_thumbnail_url" value="'+res.data.picThumbnailUrl+'"/>'+
            '                   <input type="hidden" name="detailPicUrl" id="b_pic_url_detail" value="'+res.data.detailPicUrl+'"/>'+
            '                   <input type="hidden" name="detailPicThumbnailUrl" id="b_pic_thumbnail_url_detail" value="'+res.data.detailPicThumbnailUrl+'"/>'+
            '               </form>'+
            '           </div>' +
            '           <div class="modal-footer">' +
            '               <center>' +
            '                   <button class="btn btn-primary" onclick="banner.editDetailsSubmit()" >保存</button>' +
            '                   <button class="btn btn-primary" type="button" data-dismiss="modal" aria-hidden="true">关闭</button>' +
            '               </center>' +
            '           </div>'+
            '       </div>'+
            '   </div>'+
            '</div>';

        //alert(editBannerModal);

        //显示
        /**
         * 添加html中，隐藏
         */
        document.body.appendChild($(editBannerModal)[0]);
        $('#editBannerModal').on('hidden.bs.modal', function () {
            document.body.removeChild($('#editBannerModal')[0]);
        });

        //绑定事件
        banner.bindEvent();

        //显示
        $('#editBannerModal').modal('show');


    },
    editDetailsSubmit:function(){
        $.ajax({
            url:contextPath+'/notice/banner/update',
            data:$('#editBannerForm').serialize(),
            method:'post',
            success:function(res){
                alert_message("修改成功");
                banner.table.bootstrapTable('refresh');
                $('#editBannerModal').modal('hide');
            },
            error:function(){
                alert_message("修改出错，请联系管理员");
            }
        });
    },
    deleteBanner:function(id){
        bootbox.confirm('确认删除吗？',function(result){
                if(result) {
                    $.ajax({
                        url: contextPath + '/notice/banner/deleteById/' ,
                        method: 'post',
                        data:{id:id},
                        success: function (res) {
                            banner.table.bootstrapTable('refresh');
                            alert_message("删除成功");
                        },
                        error: function () {
                            alert_message("删除出错，请联系管理员");
                        }
                    });
                }
            }
        );
    }

});